<!--
角色管理页
单仕瑞
2017年4月12日 13:44:41
-->
<template>
  <div class="box">
    <table>
      <tr>
        <td><span class="label">所属部门</span></td>
        <td><span>{{deptEntity.deptname}}</span></td>
        <td><span class="label">所属班组</span></td>
        <td><span>{{deptEntity.treamName}}</span></td>
      </tr>
      <tr>
        <td><span class="label">名称</span></td>
        <td><span>{{deptEntity.name}}</span></td>
        <td><span class="label">经纬度</span></td>
        <td><span>{{deptEntity.lngLat}}</span></td>
      </tr>
      <tr>
        <td><span class="label">地址</span></td>
        <td><span>{{deptEntity.address}}</span></td>
        <td><span class="label">控制箱编号</span></td>
        <td><span>{{deptEntity.number}}</span></td>
      </tr>
      <tr>
        <td><span class="label">接入变压器</span></td>
        <td><span>{{deptEntity.jointransformer}}</span></td>
        <td><span class="label">上级电源</span></td>
        <td><span>{{deptEntity.pidpower}}</span></td>
      </tr>
      <template v-if="deptEntity.jointransformer == '专变'">
        <tr>
          <td colspan="4" class="title">专变</td>
        </tr>
        <tr>
          <td><span class="label">专变容量</span></td>
          <td><span>{{deptEntity.zbcapacity}}</span></td>
          <td><span class="label">安装地址</span></td>
          <td><span>{{deptEntity.zbcapacityaddress}}</span></td>
        </tr>
        <tr>
          <td><span class="label">变压器生产厂家</span></td>
          <td><span>{{deptEntity.transformercompant}}</span></td>
          <td><span class="label">专变型号</span></td>
          <td><span>{{deptEntity.capacitytype}}</span></td>
        </tr>
        <tr>
          <td><span class="label">变压器出厂编号</span></td>
          <td><span>{{deptEntity.transformercompantno}}</span></td>
          <td><span class="label">变压器生产日期</span></td>
          <td><span>{{deptEntity.transformerstart}}</span></td>
        </tr>
        <tr>
          <td><span class="label">变压器额定电流</span></td>
          <td><span>{{deptEntity.ratedcurrent}}</span></td>
          <td><span class="label">A相负荷</span></td>
          <td><span>{{deptEntity.aload}}</span></td>
        </tr>
        <tr>
          <td><span class="label">B相负荷</span></td>
          <td><span>{{deptEntity.bload}}</span></td>
          <td><span class="label">C相负荷</span></td>
          <td><span>{{deptEntity.cload}}</span></td>
        </tr>
        <tr>
          <td colspan="4" class="line"></td>
        </tr>
      </template>
      <tr>
        <td><span class="label">变低出线线缆名称</span></td>
        <td><span>{{deptEntity.xlname}}</span></td>
        <td><span class="label">变低出线规格型号</span></td>
        <td><span>{{deptEntity.xlggtype}}</span></td>
      </tr>
      <tr>
        <td><span class="label">变低出线安装地址</span></td>
        <td><span>{{deptEntity.azaddress}}</span></td>
        <td><span class="label">变低出线长度</span></td>
        <td><span>{{deptEntity.cxlength}}</span></td>
      </tr>
      <tr>
        <td><span class="label">材质</span></td>
        <td><span>{{deptEntity.texture}}</span></td>
        <td><span class="label">安装类型</span></td>
        <td><span>{{deptEntity.aztype}}</span></td>
      </tr>
      <tr>
        <td><span class="label">所属行政区域</span></td>
        <td><span>{{deptEntity.areaname}}</span></td>
        <td><span class="label">控制箱生产日期</span></td>
        <td><span>{{deptEntity.kzxstart}}</span></td>
      </tr>
      <tr>
        <td><span class="label">控制箱投运日期</span></td>
        <td><span>{{deptEntity.kzxtystart}}</span></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td colspan="4" class="title">控制箱控制道路</td>
      </tr>
      <tr>
        <td><span class="label">道路</span></td>
        <td><span>{{deptEntity.kzxkzroute}}</span></td>
        <td><span class="label">电缆长度</span></td>
        <td><span>{{deptEntity.kzxdllength}}</span></td>
      </tr>
      <tr>
        <td><span class="label">电缆型号</span></td>
        <td><span>{{deptEntity.kzxroutetype}}</span></td>
        <td><span class="label">敷设方式</span></td>
        <td><span>{{deptEntity.kzxps}}</span></td>
      </tr>
      <tr>
        <td><span class="label">灯杆数量</span></td>
        <td><span>{{deptEntity.kzxroutedgnum}}</span></td>
        <td><span class="label">灯具数量</span></td>
        <td><span>{{deptEntity.kzxroutedjnum}}</span></td>
      </tr>
      <tr>
        <td><span class="label">灯杆号段</span></td>
        <td><span>{{deptEntity.kzxdghd}}</span></td>
        <td><span class="label">道路等级</span></td>
        <td><span>{{deptEntity.kzxlevel}}</span></td>
      </tr>
      <tr>
        <td><span class="label">功率</span></td>
        <td><span>{{deptEntity.kzxpower}}</span></td>
        <td><span class="label">安装类型</span></td>
        <td><span>{{deptEntity.kzxaztype}}</span></td>
      </tr>
      <tr>
        <td><span class="label">总功率</span></td>
        <td><span>{{deptEntity.kzxtotalpower}}</span></td>
        <td><span class="label">电缆总长</span></td>
        <td><span>{{deptEntity.kzxdltotallength}}</span></td>
      </tr>
      <tr><td colspan="4" class="line"></td></tr>
      <tr>
        <td><span class="label">终端编号</span></td>
        <td><span>{{deptEntity.terminalno}}</span></td>
        <td><span class="label">终端厂家</span></td>
        <td><span>{{deptEntity.terminalcompany}}</span></td>
      </tr>
      <tr>
        <td><span class="label">终端安装日期</span></td>
        <td><span>{{deptEntity.terminalaztime}}</span></td>
        <td><span class="label">是否有外接电源设备</span></td>
        <td><span>{{deptEntity.iswjpower}}</span></td>
      </tr>
      <template v-if="deptEntity.iswjpower == '是'">
        <tr><td colspan="4" class="title">外接电源设备</td></tr>
        <tr>
          <td><span class="label">设备名称</span></td>
          <td><span>{{deptEntity.wjpowername}}</span></td>
          <td><span class="label">数量</span></td>
          <td><span>{{deptEntity.wjpowernum}}</span></td>
        </tr>
        <tr>
          <td><span class="label">功率</span></td>
          <td><span>{{deptEntity.wjpower}}</span></td>
          <td><span class="label">接入时间</span></td>
          <td><span>{{deptEntity.wjpowertime}}</span></td>
        </tr>
        <tr>
          <td><span class="label">是否有标识牌</span></td>
          <td><span>{{deptEntity.wjstate}}</span></td>
          <td></td>
          <td></td>
        </tr>
        <tr>
          <td colspan="4" class="line"></td>
        </tr>
      </template>
      <tr>
        <td> <span class="label">图片</span></td>
        <td>
          <span>
          <img class="pic" v-for="(item,index) in configPicList" :src="item.url" alt="" :key="index" :preview="1" preview-text="">
          </span>
        </td>
        <td></td>
        <td></td>
      </tr>
    </table>
  </div>
</template>

<script type="text/ecmascript-6">
  // import menuControl from './menuControl.vue'
  import {buttonAuth, resetBreads, sessionOut} from '../../smartlight/common/js/util.js'
  import $ from 'jquery'

  export default {
    data () {
      return {
        saveDeptLoading: false, // 保存部门动画按钮
        filters: {
          deptName: ''
        },
        isshow: true,
        deptList: [],
        teamList: [],
        total: 2,
        page: 1,
        pageSize: 10,
        checkDeptName: false, // 设置修改角色时【角色名称】灰化
        sels: [], // 列表选中列
        listLoading: false,
        showAdd: false,
        addLoading: false,
        companyId: '', // 公司id
        companytype: '', // 公司帐号类型
        tipsTitle: '提示',
        diaAlert: false, // 控制展示登录超时
        deptEntity: {
          id: '',
          name: '',
          lngLat: '',
          deptid: '',
          treamId: ''
        },
        opType: 'add',
        type: '',
        dialogTitle: '新增配电箱',
        list: [],
        imgUrl: sessionStorage.getItem('prefix'),
        configPicData: {}, // 图片附件数据
        configPicList: [], // 图片集合
      }
    },
    methods: {
      checkIfLogin () { // 判断是否登录超时
        var user = sessionStorage.getItem('user')
        if (!user) {
          this.$alert('登录超时，请重新登录！', ' ', {
            type: 'warning'
          }).then(() => {
            this.$router.push({path: '/login'})
            sessionStorage.clear()
          })
        } else {
          return true
        }
      },

      aginLogin () { // 登录超时后点击【确定】按钮事件--单仕瑞--2017年4月25日 16:36:53
        this.diaAlert = false
        this.$router.push({path: '/login'})
        sessionStorage.clear()
      },
      getDetail (index, row) { // 控制修改角色时的弹出层--单仕瑞--2017年4月12日 13:44:41
        var params = {
          boxId: this.$route.query.id,
          type: 0
        }

        console.log(params)
        this.$http.post('/smartLight/web/distridutionBox/getById.htm', params).then(response => {
          var resBody = response.body
          if (resBody.isSuccess === 0) {
            this.deptEntity = resBody.result
            var arr = this.deptEntity.pic?this.deptEntity.pic.split(",").map(item=>{
              return {url: this.imgUrl + item}
            }):[]
            this.configPicList = arr;
            this.$nextTick(()=> {
              this.$previewRefresh()
            })
            console.log(resBody.result)
          } else if (resBody.isSuccess === 2) {
            this.listLoading = false
            sessionOut(this) // session超时处理
          } else {
            this.$message({
              showClose: true,
              message: resBody.errorMsg,
              type: 'error'
            })
          }
        })
//        this.deptEntity = Object.assign({}, row)
        console.log(this.deptEntity)
      },
    },
    created() {
      var user = sessionStorage.getItem('user')
      if (user) {
        user = JSON.parse(user)
        this.loginType = user.type
        this.companytype = user.type
        this.companyId = user.companyId
        this.deptEntity.deptName = this.deptName
        // 浏览器向前或向后处理
        resetBreads(this)
      }
      this.getDetail()
    },
    mounted () { // 钩子函数，相当于进入页面后的初始化

    },
    components: {
      // menuControl
    }
  }
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
  .box>div{
    width 450px;
    float left
  }
  .box>div span{

    color #333
  }
  .box>div .label{
    color #999999;
    display inline-block;
    width 100px;
  }
  .box table{
    border-collapse collapse
    table-layout fixed
  }
  .box td{
    border 1px solid #e5e5e5;
    line-height 50px;
  }
  .box td:nth-child(2n+1){
    width 140px
    padding-left 15px
    color #666
  }
  .box td:nth-child(2n){
    width 400px
    padding-left 15px
  }
  .pic{
    width 100px;
    margin-top 5px;
  }
  .title{
    font-size 16px
    font-weight bold
  }
  .line{
    height 25px;
  }
</style>
